<template>
  <div class="app-container">
    <div class="pd-tb10 pd-l-10">{{this.importantInfo.projectName}} / {{ getJieDuanName(this.importantInfo.jieDuan) }} / {{this.importantInfo.supplyCompanyName}}</div>
    <div class="hor mg-b-10">
      <div class="match-width">
        <el-tabs v-model="activeName" @tab-click="handleClick">
          <el-tab-pane
            v-for="(tab, index) in tabList"
            :key="index"
            :label="tab.nameType1"
            :name="tab.indexName"
          >
            <el-table
              ref="table"
              v-loading="listLoading"
              :data="tab.value"
              element-loading-text="Loading"
              :max-height="autoHeight"
              @row-dblclick="onItemDoubleClick"
              border
              fit
              highlight-current-row
            >
              <el-table-column label="名称" align="center" width="">
                <template slot-scope="scope">
                  {{ scope.row.name }}
                </template>
              </el-table-column>
              <el-table-column label="系统分类" align="center" width="100">
                <template slot-scope="scope">
                  {{ scope.row.xiTongFenLei }}
                </template>
              </el-table-column>
              <el-table-column label="分析分类1" width="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.fenXiFenLei1 }}
                </template>
              </el-table-column>
              <el-table-column label="分析分类2" width="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.fenXiFenLei2 }}
                </template>
              </el-table-column>
              <el-table-column label="规格型号" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.modelCode }}
                </template>
              </el-table-column>
              <el-table-column label="项目特征及主要工程内容" width="500" align="">
                <template slot-scope="scope">
                  {{ scope.row.teZhengNeiRong }}
                </template>
              </el-table-column>
              <el-table-column label="单位" width="60" align="center">
                <template slot-scope="scope">
                  {{ scope.row.unit }}
                </template>
              </el-table-column>
              <el-table-column label="品牌" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.brand }}
                </template>
              </el-table-column>
              <el-table-column label="主材供应方式" width="100" prop="gongChengLiang" align="center">
                <template slot-scope="scope">
                  {{ scope.row.zhuCaiGongYing }}
                </template>
              </el-table-column>
              <el-table-column label="工程量汇总" width="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.gongChengLiangHuiZong }}
                </template>
              </el-table-column>
<!--              <el-table-column label="工程量-地下室" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangDiXiShi }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-高层" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangGaoCeng }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-小高层" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangXiaoGaoCeng }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="程量-洋房" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangYangFang }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-商业" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangShangYe }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-总平" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangZongPing }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-别墅" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangBieShu }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-公寓" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangGongYu }}-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column label="工程量-幼儿园" width="" align="center">-->
<!--                <template slot-scope="scope">-->
<!--                  {{ scope.row.gongChengLiangYouErYuan }}-->
<!--                </template>-->
<!--              </el-table-column>-->
              <el-table-column label="综合单价1(新项目不含增值税)" width="" prop="shuiJin" align="center">
                <template slot-scope="scope">
                  <div class="text-center"
                       :class="{'bg-red':scope.row.comprehensivePriceBhsCalcd!=scope.row.comprehensivePriceBhs,'font-color-white':scope.row.comprehensivePriceBhsCalcd!=scope.row.comprehensivePriceBhs,'font-black':scope.row.comprehensivePriceBhsCalcd == scope.row.comprehensivePriceBhs}">
                    {{ scope.row.comprehensivePriceBhs }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="综合单价1(新项目不含增值税计算值)" width="100" prop="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.comprehensivePriceBhsCalcd }}
                </template>
              </el-table-column>
<!--              <el-table-column label="综合单价2(新项目含增值税)" width="" prop="" align="center">-->
              <el-table-column label="含税单价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <div class="text-center"
                       :class="{'bg-red':scope.row.comprehensivePriceHsCalcd!=scope.row.comprehensivePriceHs,'font-color-white':scope.row.comprehensivePriceHsCalcd!=scope.row.comprehensivePriceHs,'font-black':scope.row.comprehensivePriceHsCalcd == scope.row.comprehensivePriceHs}">
                    {{ scope.row.comprehensivePriceHs }}
                  </div>
                </template>
              </el-table-column>
<!--              <el-table-column label="综合单价2(新项目含增值税计算值)" width="100" prop="" align="center">-->
              <el-table-column label="含税单价" width="100" prop="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.comprehensivePriceHsCalcd }}
                </template>
              </el-table-column>
              <el-table-column label="人工费" width="100" prop="renGongCost" align="center">
                <template slot-scope="scope">
                  {{ scope.row.renGongCost }}
                </template>
              </el-table-column>
              <el-table-column label="主材费" width="100" prop="zhuCaiCost" align="center">
                <template slot-scope="scope">
                  {{ scope.row.zhuCaiCost }}
                </template>
              </el-table-column>
              <el-table-column label="辅材及其他材料费" width="100" prop="fuCaiCost" align="center">
                <template slot-scope="scope">
                  {{ scope.row.fuCaiCost }}
                </template>
              </el-table-column>
              <el-table-column label="机械费" width="100" prop="jiXieCost" align="center">
                <template slot-scope="scope">
                  {{ scope.row.jiXieCost }}
                </template>
              </el-table-column>
              <el-table-column label="企业管理费" width="" prop="" align="center">
                <template slot-scope="scope">
                  <div class="text-center"
                       :class="{'bg-red':scope.row.qiYeCalcd!=scope.row.qiYeCost,'font-color-white':scope.row.qiYeCalcd!=scope.row.qiYeCost,'font-black':scope.row.qiYeCalcd == scope.row.qiYeCost}">
                    {{ scope.row.qiYeCost }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="企业管理费(计算值)" width="100" prop="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.qiYeCalcd }}
                </template>
              </el-table-column>
              <el-table-column label="增值税税额" width="" prop="" align="center">
                <template slot-scope="scope">
                  <div class="text-center"
                       :class="{'bg-red':scope.row.shuiJinCalcd!=scope.row.shuiJin,'font-color-white':scope.row.shuiJinCalcd!=scope.row.shuiJin,'font-black':scope.row.shuiJinCalcd == scope.row.shuiJin}">
                    {{ scope.row.shuiJin }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="增值税税额(计算值)" width="100" prop="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.shuiJinCalcd }}
                </template>
              </el-table-column>
              <el-table-column label="不含增值税合价" width="" prop="comprehensivePrice" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPriceBhs != null && scope.row.totalPriceBhs !== ''">{{
                      scope.row.totalPriceBhs.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="含增值税合价" width="" prop="totalPrice" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPriceHs != null && scope.row.totalPriceHs !== ''">{{
                      scope.row.totalPriceHs.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>

              <el-table-column label="地下室含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice1 != null && scope.row.totalPrice1 !== ''">{{
                      scope.row.totalPrice1.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="高层含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice2 != null && scope.row.totalPrice2 !== ''">{{
                      scope.row.totalPrice2.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="小高层含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice3 != null && scope.row.totalPrice3 !== ''">{{
                      scope.row.totalPrice3.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="洋房含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice4 != null && scope.row.totalPrice4 !== ''">{{
                      scope.row.totalPrice4.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="商业含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice5 != null && scope.row.totalPrice5 !== ''">{{
                      scope.row.totalPrice5.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="总平含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice6 != null && scope.row.totalPrice6 !== ''">{{
                      scope.row.totalPrice6.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="别墅含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice7 != null && scope.row.totalPrice7 !== ''">{{
                      scope.row.totalPrice7.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="公寓含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice8 != null && scope.row.totalPrice8 !== ''">{{
                      scope.row.totalPrice8.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="幼儿园含增值税合价" width="" prop="" align="center">
                <template slot-scope="scope">
                  <span
                    v-if="scope.row.totalPrice9 != null && scope.row.totalPrice9 !== ''">{{
                      scope.row.totalPrice9.toFixed(2)
                    }}</span>
                  <span v-else></span>
                </template>
              </el-table-column>
              <el-table-column label="备注" width="" prop="" align="center">
                <template slot-scope="scope">
                  {{ scope.row.remarks }}
                </template>
              </el-table-column>
              <el-table-column label="是否为增补清单内容" width="" prop="shuiJin" align="center">
                <template slot-scope="scope">
                  <div v-if="scope.row.nameType2 != null">{{"是"}}</div>
                  <div v-else>{{"否"}}</div>
                </template>
              </el-table-column>
              <el-table-column class-name="status-col" label="操作" align="center" width="140">
                <template slot-scope="scope">
                  <div class="hor ver-center" v-if="scope.row.id != null">
                    <el-button type="info" class="" size="mini"
                               @click.stop="onClickView(scope.row)">编辑
                    </el-button>
                    <el-button type="danger" class="pd-lr10" size="mini" :loading="onDeleteLoading"
                               @click.stop="onDeleteId=scope.row.id; onDeleteShow = true ">删除
                    </el-button>
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <div>
      <el-dialog
        title="编辑供应商内线清单信息"
        :visible.sync="infoDialogShow"
        :close-on-click-modal=false
        width="1280px"
        center>
        <div class="ver match-width">
          <div class="ver">
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">名称</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.name">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">系统分类</div>
              <el-select v-model="tabulationDetails.xiTongFenLei" placeholder="请选系统分类"
                         style="width: 170px" clearable filterable>
                <el-option
                  v-for="item in fenLeiList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">分析分类1</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.fenXiFenLei1">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">分析分类2</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.fenXiFenLei2">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">规格型号</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.modelCode">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">项目特征及主要工程内容</div>
              <el-input class="flex1 font-text-color-main-title" type="textarea" maxlength="512"
                        :autosize="{minRows: 3, }"
                        v-model="tabulationDetails.gongZuoNeiRong" placeholder="请输入"/>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">单位</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.unit">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">品牌</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.brand">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">主材供应方式</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.zhuCaiGongYing">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量汇总</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangHuiZong">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-地下室</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangDiXiShi">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-高层</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangGaoCeng">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-小高层</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.gongChengLiangXiaoGaoCeng">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-洋房</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangYangFang">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-商业</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangShangYe">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-总平</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangZongPing">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-别墅</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" maxlength="128"
                        v-model="tabulationDetails.gongChengLiangBieShu">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-公寓</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangGongYu">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">工程量-幼儿园</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.gongChengLiangYouErYuan">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">综合单价1(新项目不含增值税)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.comprehensivePriceBhs">
              </el-input>
            </div>

            <div class="hor ver-center mg-t-20">
<!--              <div style="width: 80px;" class="font14 font-text-color-main-title">综合单价2(新项目含增值税)</div>-->
              <div style="width: 80px;" class="font14 font-text-color-main-title">含税单价</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.comprehensivePriceHs">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">人工费</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.renGongCost">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">主材费</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.zhuCaiCost">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">辅材及其他材料费</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.fuCaiCost">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">机械费</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.jiXieCost">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">企业管理费</div>
              <el-tooltip class="" effect="dark" content="e=(a+b+c+d)*Ⓐ;请填写公式中Ⓐ的值" placement="right-start">
                <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                          v-model="tabulationDetails.qiYeCostFillIn">
                </el-input>
              </el-tooltip>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">税金</div>
              <el-tooltip class="" effect="dark" content="f=(a+b+c+d+e)*Ⓑ;请填写公式中Ⓑ的值" placement="right-start">
                <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                          v-model="tabulationDetails.shuiJinFillIn">
                </el-input>
              </el-tooltip>
              <div class="mg-lr-20"></div>
              <<div style="width: 80px;" class="font14 font-text-color-main-title">合价-不含增值税</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPriceBhs">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">合价-含增值税</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPriceHs">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(地下室合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice1">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(高层合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice2">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(小高层合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice3">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(洋房合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice4">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(商业合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice5">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(总平合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice6">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">增值税(别墅合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice7">
              </el-input>
            </div>
            <div class="hor ver-center mg-t-20">
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(公寓合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice8">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">含增值税(幼儿园合计)</div>
              <el-input class="flex1 font-text-color-main-title" style="width: 50px" type="number"
                        v-model="tabulationDetails.totalPrice9">
              </el-input>
              <div class="mg-lr-20"></div>
              <div style="width: 80px;" class="font14 font-text-color-main-title">备注</div>
              <el-input class="flex1 font-text-color-main-title"  type="textarea" maxlength="512"
                        :autosize="{minRows: 3, }"
                        v-model="tabulationDetails.remarks" placeholder="请输入"/>
            </div>
          </div>
          <div class="hor match-width ver-center hor-center mg-t-20">
            <el-button @click="infoDialogShow = false">取 消</el-button>
            <el-button type="primary" slot="reference" :loading="onSaveLoading" class="mg-l-10"
                       @click="onClickSave">保存
            </el-button>
          </div>
        </div>
      </el-dialog>
    </div>
    <div>
      <el-dialog
        title="提示"
        :visible.sync="onDeleteShow"
        :close-on-click-modal=false
        width="30%">
        <span>删除后无法恢复</span>
        <span slot="footer" class="dialog-footer">
                    <el-button @click="onDeleteShow = false">取消</el-button>
                    <el-button type="danger" @click="deleteById"
                               :loading="onDeleteLoading">删除</el-button>
                  </span>
      </el-dialog>
    </div>
  </div>

</template>

<script>
import {getCityData} from "@/js/cityData";

const requestXfgcBidBaseTabulation = require('@/api/tabulation/xfgcBidBaseTabulation')
const requestXfgcTabulation = require('@/api/tabulation/xfgcTabulation')
const requestSupplier = require('@/api/project/supplyCompany')
const request = require('@/api/project/biddingCompany')
export default {

  data() {
    return {
      activeName: 1,
      allList: [],
      tabList: null,
      page: 1,
      size: 20,
      total: 0,
      autoHeight: 600,//根据屏幕高度自动计算的高度
      //筛选参数
      params: {
        flag: 1,
      },
      onDeleteShow:false,
      onDeleteId: "",
      onDeleteLoading:false,
      listLoading: false,
      onSaveLoading: false,
      areaData: [],
      importantInfo: {},

      tabulationDetails:{},
      infoDialogShow: false,
      fenLeiList: [
        {
          value: "火灾报警系统",
          label: '火灾报警系统'
        },
        {
          value: "消防广播系统",
          label: '消防广播系统'
        },
        {
          value: "消火栓系统",
          label: '消火栓系统'
        },
        {
          value: '自动喷淋系统',
          label: '自动喷淋系统'
        },
        {
          value: '余压监控系统',
          label: '余压监控系统'
        },
        {
          value: '灭火器系统',
          label: '灭火器系统'
        },
        {
          value: '防火卷帘系统',
          label: '防火卷帘系统'
        },
        {
          value: '气体灭火系统',
          label: '气体灭火系统'
        },
        {
          value: '防火门监控系统',
          label: '防火门监控系统'
        },
        {
          value: '消防设备电源监控系统',
          label: '消防设备电源监控系统'
        },
        {
          value: '电气火灾监控系统',
          label: '电气火灾监控系统'
        },
        {
          value: '集中控制型应急照明系统',
          label: '零星其他系统'
        },
        {
          value: '零星其他系统',
          label: '零星其他系统'
        },
        {
          value: '消防检测及验收',
          label: '消防检测及验收'
        },
        {
          value: '抗震支架系统',
          label: '抗震支架系统'
        },
        {
          value: '质保期内维保',
          label: '质保期内维保'
        },
        {
          value: '增补清单',
          label: '增补清单'
        },
      ],
    }
  },
  beforeMount() {
    this.autoHeight = document.body.scrollHeight - 220
    this.importantInfo = JSON.parse(this.$route.query.importantInfo)
  },
  mounted() {
    this.areaData = getCityData()
    this.getAllTabs()
    //去掉第三级的信息
    for (let i = 0; i < this.areaData.length; i++) {
      if (this.areaData[i].children != null && this.areaData[i].children.length > 0) {
        for (let j = 0; j < this.areaData[i].children.length; j++) {
          this.areaData[i].children[j].children = null
        }
      }
    }
  },
  methods: {
    formatDate(timestamp) {
      const date = new Date(timestamp);
      const year = date.getFullYear();
      const month = String(date.getMonth() + 1).padStart(2, '0');
      const day = String(date.getDate()).padStart(2, '0');
      const hours = String(date.getHours()).padStart(2, '0');
      const minutes = String(date.getMinutes()).padStart(2, '0');
      const seconds = String(date.getSeconds()).padStart(2, '0');

      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    },
    getJieDuanName(value) {
      switch (value) {
        case 1:
          return "标底";
        case 2:
          return "回标1";
        case 3:
          return "回标2";
        case 4:
          return "回标3";
        case 5:
          return "定标"
        default:
          return "";
      }
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    getAllTabs() {
      if (this.importantInfo.type === 1) {
        this.getBidBaseTabList()
      } else if (this.importantInfo.type === 2) {
        this.getXfgcTabList()
      }
    },

    getXfgcTabList() {
      this.listLoading = true
      const data = new FormData()
      data.append('xfgcBiddingCompanyId', this.importantInfo.xfgcBiddingCompanyId)
      data.append('jieDuan', this.importantInfo.jieDuan)

      const sortList = []
      sortList.push(
        {
          direction: 'desc',
          property: 'createTime'
        }
      )
      data.append('sortJsonStr', JSON.stringify(sortList))
      requestXfgcTabulation.getXfgcTabList(data).then(response => {
        this.tabList = response.data
        this.total = response.totalElements
        this.listLoading = false
      })
    },
    getBidBaseTabList() {
      this.listLoading = true
      const data = new FormData()
      data.append('projectId', this.importantInfo.projectId)
      const sortList = []
      sortList.push(
        {
          direction: 'desc',
          property: 'createTime'
        }
      )
      data.append('sortJsonStr', JSON.stringify(sortList))
      requestXfgcBidBaseTabulation.getBidBaseTabList(data).then(response => {
        this.tabList = response.data
        this.total = response.totalElements
        this.listLoading = false
      })
    },

    onItemDoubleClick(row) {//单行双击
      this.onClickView(row)
    },
    onClickView(row) {
      this.tabulationDetails = JSON.parse(JSON.stringify(row))
      this.infoDialogShow = true
    },
    onClickSave() {//点击保存
      if (this.tabulationDetails.name == null || this.tabulationDetails.name === "") {
        this.$message({
          message: '名称不能为空',
          type: 'warning',
          duration: 2000
        })
        return
      }
      if (this.importantInfo.type === 1) {
        this.requestBidBaseSave()
      } else if (this.importantInfo.type === 2) {
        this.requestXfgcSave()
      }

    },
    requestBidBaseSave() {
      this.onSaveLoading = true
      requestXfgcBidBaseTabulation.saveByJson(this.tabulationDetails).then(response => {
        this.onSaveLoading = false
        this.infoDialogShow = false
        this.$message({
          message: '保存成功',
          type: 'success',
          duration: 2000
        })
        this.getBidBaseTabList()
      }).catch((e) => {
        this.onSaveLoading = false
      })
    },
    requestXfgcSave() {
      this.onSaveLoading = true
      requestXfgcTabulation.saveByJson(this.tabulationDetails).then(response => {
        this.onSaveLoading = false
        this.infoDialogShow = false
        this.$message({
          message: '保存成功',
          type: 'success',
          duration: 2000
        })
        this.getXfgcTabList()
      }).catch((e) => {
        this.onSaveLoading = false
      })
    },
    deleteById(){
      if (this.importantInfo.type === 1) {
        this.deletesByBdqdId()
      } else if (this.importantInfo.type === 2) {
        this.deletesByQdId()
      }
    },
    //删除标底
    deletesByBdqdId() {
      this.$message({
        message: '操作中',
        type: 'warning',
        duration: 1000
      })
      this.onDeleteLoading = true
      const data = new FormData()
      data.append('ids', [this.onDeleteId])
      requestXfgcBidBaseTabulation.batchDelete(data).then(response => {
        this.$message({
          message: '删除成功',
          type: 'success',
          duration: 3000
        })
        this.onDeleteLoading = false
        this.onDeleteShow = false
        this.getBidBaseTabList()
      }).catch((e) => {
        this.onDeleteLoading = false
      })
    },
    deletesByQdId(){
      this.$message({
        message: '操作中',
        type: 'warning',
        duration: 1000
      })
      this.onDeleteLoading = true
      const data = new FormData()
      data.append('ids', [this.onDeleteId])
      requestXfgcTabulation.batchDelete(data).then(response => {
        this.$message({
          message: '删除成功',
          type: 'success',
          duration: 3000
        })
        this.onDeleteLoading = false
        this.onDeleteShow = false
        this.getXfgcTabList()
      }).catch((e) => {
        this.onDeleteLoading = false
      })
    }
  }
}
</script>

<style scoped>
.cus-table {
  border-collapse: collapse;
  text-align: center;
}

.cus-table td, .cus-table th {
  border: 1px solid #cad9ea;
  color: #424242;
  height: 50px;
}

.cus-table th {
  background-color: #EFEFEF;
  width: 100px;
  color: #414141;
  font-size: 14px;
}
</style>
